<template>
	<view>
		
		
		<u-button type="primary" text="添加" @click="add()"></u-button>
		<!-- <view class="tab">
			<view class="time">
				可售时间
			</view>
			<view class="price">
				可售价格
			</view>
			<view class="num">
				可售数量
			</view>
			<view class="cz">
				操作
			</view>
		</view> -->


		<u-popup mode="center" :show="stock.popup" round="12">

			<view class="popups pr">
				<view class="popups-title">
					{{stock.types == 1?'添加':'修改'}}
				</view>

				<view class="popups-put xflex-x" @click="show = true" v-if="stock.type == 1 && stock.types == 1">

					{{stock.date ? $u.timeFormat(stock.date, 'yyyy年mm月dd日') : '请选择时间'}}
					<!-- <input type="text" placeholder="请输入价格"  v-model="pricePopup.value" /> -->
				</view>

				<!-- <image class="popups-gb pa" @click="info.show = false" src="../../g" mode=""></image> -->
				<view class="popups-put xflex-x">
					<input type="text" placeholder="请输入价格" v-model="stock.price" />
				</view>

				<view class="popups-put xflex-x">
					<input type="text" placeholder="请输入库存" v-model="stock.stock" />
				</view>

				<view class="xflex-x-center popups-btn">
					<view class="popups-btn1" @click="stock.popup = false">
						取消
					</view>
					<view class="popups-btn2 xml32" @click="getaddStock()">
						确定
					</view>
				</view>
			</view>
		</u-popup>


		<view class="tab xm24 xp24 xbs xflex-x-between" v-for="(item,index) in list" :key="index" @click="exit(item)">
			
			<view class="tabItem xflex-y-center">
				<view class="">
					可售时间
				</view>
				<view class="tabValue">
					{{item.date}}
				</view>
			</view>
			
			<view class="tabItem xflex-y-center">
				<view class="">
					可售价格
				</view>
				<view class="tabValue">
					{{item.price}}
				</view>
			</view>
			
			<view class="tabItem xflex-y-center">
				<view class="">
					可售数量
				</view>
				<view class="tabValue">
					{{item.stock}}
				</view>
			</view>
			<!-- <view class="time">
				{{item.date}}
			</view>
			<view class="price">
				{{item.price}}
			</view>
			<view class="num">
				{{item.stock}}
			</view>
			<view class="cz">
				<view class="" @click="exit(item)">
					修改
				</view>
			</view> -->
		</view>



		<u-datetime-picker :show="show" :minDate="new Date()" v-model="stock.date" mode="date" @cancel="show = false"
			@confirm="show = false"></u-datetime-picker>
	</view>
</template>

<script setup>
	import {
		reactive,
		ref
	} from 'vue';
	import {
		onBackPress,
		onLoad
	} from "@dcloudio/uni-app"
	import {
		addStocksa,getStocksa,editStock
	} from '../../../network/home.js'


	let show = ref(false)
	let stock = reactive({
		house_id: '',
		date: '',
		price: '',
		stock: '',
		type: 1,
		types:1,
		popup:false,
		id:''
	})
	
	const add = () =>{
		stock.popup = true
		stock.price = ''
		stock.stock = ''
		stock.date = ''
		stock.types = 1
	}
	const exit = (data) =>{
		stock.popup = true
		stock.types = 2
		stock.price = data.price
		stock.stock = data.stock
		stock.id = data.id
	}
	
	
	let list = ref([])
	
	onLoad((option) =>{
		stock.type = option.type
		stock.house_id = option.id
		
		getStock()
	})
	
	
	
	// 获取库存 
	const getStock = () =>{
		getStocksa({
			house_id: stock.house_id,
		}).then(res=>{
			console.log(res);
			list.value = res.data
		})
	}


	const getaddStock = () => {
		
		// 判断添加
		if(stock.types == 1){
			addStocksa({
				house_id: stock.house_id,
				date: uni.$u.timeFormat(stock.date, 'yyyy-mm-dd'),
				price: stock.price,
				stock:stock.stock,
			}).then(res => {
				uni.showToast({
					icon: "none",
					title: '添加成功'
				})
				getStock()
				stock.popup = false
			})
		}else{
			editStock({
				price: stock.price,
				stock:stock.stock,
				stock_id:stock.id
			}).then(res=>{
				uni.showToast({
					icon: "none",
					title: '修改成功'
				})
				getStock()
				stock.popup = false
			})
		}
		
	}
</script>

<style lang="scss" scoped>
	.tab {
		width: 686rpx;
		height: 143rpx;
		background: #ffffff;
		box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(0, 0, 0, 0.05);
		border-radius: 12rpx;
		
		
		
	}
	.tabItem {
		flex: 1;
	}
	
	.tabValue {
		font-size: 26rpx;
		color: #666;
		margin-top: 10rpx;
	}

	.popups {
		width: 600rpx;
		background: #FFFFFF;
		border-radius: 30rpx;

		&-title {
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 36rpx;
			color: #111111;
			text-align: center;
			margin-top: 40rpx;
		}

		&-gb {
			width: 40rpx;
			height: 40rpx;
			top: 30rpx;
			right: 30rpx;
		}

		&-put {
			width: 420rpx;
			height: 88rpx;
			background: #F5F5F5;
			border-radius: 10rpx;
			margin: auto;
			margin-top: 85rpx;
			padding: 0 40rpx;

		}

		&-btn {
			margin-top: 61rpx;
		}

		&-btn1 {
			width: 214rpx;
			height: 72rpx;
			border-radius: 36rpx;
			border: 1px solid #999999;

			font-family: PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #333333;
			text-align: center;
			line-height: 72rpx;
		}

		&-btn2 {
			width: 214rpx;
			height: 72rpx;
			background: linear-gradient(90deg, #0DBFFB, #198EFF);
			border-radius: 36rpx;

			font-family: PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #fff;
			text-align: center;
			line-height: 72rpx;
		}
	}
</style>